<template>
	<view class="container flex-c">
		<uni-nav-bar class="ch-nav" height="88rpx" backgroundColor="#ffffff" leftWidth="90rpx" rightWidth="90rpx" color="#333" :fixed="true" :padding="false" :border="false" @clickLeft="$goBack(1)">
			<template slot="left">
				<image class="left" src="@/public/images/public/dhl_fhjt.png" mode="aspectFit"></image>
			</template>
			<text class="title">修改登录密码</text>
		</uni-nav-bar>
		<view class="body flex-c">
			<view class="input-box">
				<input class="input" name="oldpwd" type="password" placeholder="请输入原登录密码" placeholder-style="color:#999999;font-size:30rpx" v-model="oldPwd"/>
			</view>
			<view class="input-box flex-c">
				<input class="input border" name="newpwd" type="password" placeholder="请输入新密码" placeholder-style="color:#999999;font-size:30rpx" v-model="newPwd"/>
				<input class="input" name="newpwd2" type="password" placeholder="请再次确认密码" placeholder-style="color:#999999;font-size:30rpx" v-model="newPwd2"/>
			</view>
		</view>
		<view class="foot">
			<view class="submit-box">
				<button type="default" :class="{'active': canSubmit}" @tap="submit">确认</button>
			</view>
		</view>
	</view>
</template>

<script>
	import imMsg from "@/utils/common/message.js";
	export default {
		data() {
			return {
				oldPwd: '',
				newPwd: '',
				newPwd2: '',
				isSubmit: false
			}
		},
		computed: {
			user() {
				return this.$store.state.user
			},
			canSubmit() {
				return this.oldPwd != '' && this.oldPwd.length >= 6 && this.newPwd == this.newPwd2 != '' && this.newPwd.length >= 8
			}
		},
		onLoad() {
			
		},
		methods: {
			//提交重置密码
			submit(){
				if(this.isSubmit || !this.canSubmit) {
					if(this.newPwd != this.newPwd2){
						uni.showToast({
							title: '两次输入的密码不一致',
							icon: 'none'
						});
					}
					return
				}
				if(this.newPwd != '' && !/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z\.\#\@\&\_\-\$\%\*]{8,}$/.test(this.newPwd)){
					uni.showToast({
						title: '请输入至少8位由数字、大小写字母和特殊符号组成的密码',
						icon: 'none',
						duration: 3000
					});
					return
				}
				this.isSubmit = true
				this.$http.post({
					url: '/api/appUser/updateAppUserPwd',
					data: {
						oldPassword: this.oldPwd,
						password: this.newPwd,
						userId: this.user.userId
					}
				}).then((data) =>{
					console.log(data);
					if(data.success && data.code == 200){
						this.$ShowToast({text: '密码修改成功', type: 1})
						uni.showToast({
							title: data.message || '密码修改成功',
							icon: 'success'
						})
						setTimeout(()=>{
							this.isSubmit = false
							this.$goBack(1)
						}, 1000)
					}else{
						this.isSubmit = false
						uni.showModal({
							title: '系统提示',
							content: data.message || '密码修改失败，请重试',
							showCancel: false,
						})
					}
				}).catch((err) => {
					console.log(err);
					this.isSubmit = false
					uni.showModal({
						title: '系统提示',
						content: '操作失败，请稍后重试',
						showCancel: false,
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		min-height: var(--safe-height);
	}
	.body{
		.input-box{
			margin-top: 20rpx;
			background: #FFFFFF;
			.input{
				border: none;
				width: 100%;
				height: 96rpx;
				padding: 0 20rpx;
				box-sizing: border-box;
				&.border{
					border-bottom: 1rpx solid #EDEDED;
				}
			}
		}
	}
	.foot{
		margin: 40rpx 20rpx;
		.submit-box{
			margin-top: 0;
		}
	}
</style>
